<%-- 
  - Author: Abed Yaseen
  - Date: 02-Jan-2012
  - Copyright Notice: TRAKHEES
  - Description: review/form.jsp
 --%>
 <%@ include file="/WEB-INF/view/include.jsp"%>

    <div class="t_tmiddle-right">
	    <div id="tabs">
	      <ul id="TabHeader">
	        <li><a href="#ApplicationDetails"><spring:message code="header.app.details" /></a></li>
	      </ul>
	      <form:form modelAttribute="EmploymentVisaReviewerInfo" name="EmploymentVisaReviewFrm"  id="EmploymentVisaReviewFrm"  method="POST" class="t_form">
				<spring:hasBindErrors
							name="EmploymentVisaReviewerInfo">
								<script type="text/javascript">
									$(document).ready(
											function() {
												jAlert('error', '<li><form:errors path="*" delimiter="<li>"/>',
														'<spring:message code="label.errormessage" />');
											});
						</script>
			    </spring:hasBindErrors>
			    <table border="0" style="width: 100%">
			    	<tr height="5px;"><td colspan="3"></td></tr>
			    	<tr><td width="20%"></td><td align="center"><div class="t_gin-grey-txt"><spring:message code="label.wfstatus" />${EmploymentVisaReviewerInfo.wfStatus}</div></td><td width="20%"></td></tr>
			    </table>
					
		  		<%@include file="AppDetails.jsp" %>
				
		 </form:form>
	      
       </div>
    </div>
    <!--Middle Right Close-->
<script>
/*submit decision variables for validation*/
var submAction = null;

function setAction(inaction){
	submAction = inaction;
}

		$().ready(function() {
			


			$("#yourBackBtn")
			      .click(function() {
			            history.back();
			            return false;
			      });
		
			$(".topnav").accordion({
				accordion:false,
				speed: 500,
				closedSign: '<img src=\'resources/images/common/close.jpg\' />',
				openedSign: '<img src=\'resources/images/common/open.jpg\' />'
			});
			
			if($('#strNationality').val() != "" && $('#strNationality').val() != null){
				updateCity();
			}
			
			if($('#strEmirate').val() != "" && $('#strEmirate').val() != null){
				updateEmirateCity();
			}
			
			$('#strPostNo').val('Auto Generated');
			
			
			$("#EmploymentVisaReviewFrm").validate({

				onfocusout:false,
				onkeyup:false,
				onclick: false,			
				rules : {
					//Employee Details
					fnpServiceCode : {
						required : {
							depends: function(element) {
					           return submAction == "submit";
					        }
						}
					},
					adminComments : {
						required : {
							depends: function(element) {
					           return submAction == "reject";
					        }
						}
					}
				},
				
				submitHandler: function (form) {
					blockPage();
					form.submit();
				},
				
				showErrors : function(errorMap, errorList) {
					
					var errors = '<ul>';
					var label;				
					if (errorList.length) {
						$.each(errorMap, function(name, value) {
							label = $("label[for='" + name + "']").html();
							label = value + '[' + label + ']';
							errors = errors + '<li>' + label + '</li>';
							

						});
						errors = errors + '</ul>';
						jAlert('error', errors, '<spring:message code="label.errormessage" />');
						return false;
					}
				}		
			});// end $("#EmploymentVisaFrm").validate
			
			$tabs = $("#tabs").tabs();	
			$('#TabHeader').removeClass('ui-tabs-nav ui-helper-reset ui-helper-clearfix ui-widget-header ui-corner-all');
			$('#TabHeader > li').removeClass('ui-state-default ui-corner-top ui-state-active ui-state-hover');
			$('#tabs').removeClass('ui-widget ui-widget-content ui-corner-all');
			
			$('#tabs').tabs({
				select : function(event, ui) {
					
					var selected = $tabs.tabs('option', 'selected'); // => 0
					var clicked = ui.index; // => 0
										
					if( selected > clicked )
						return true;
					
					var isValid = validate();// form validation returning true or false
					
					if(clicked == 6){
						updateSummaryTab();
						//updateAttachmentsTab();
					}else if(clicked == 5){
						//updateAttachmentsTab();
					}
					return isValid;
				}
			});
			
	
			$('#AppDet-Next').click(function() { // bind click event to link			
				$tabs.tabs('select', 1);
				return false;
				//$('#EmploymentVisaFrm').submit();
			});
			
			$('#SubDet-Prev').click(function() { // bind click event to link			
				$tabs.tabs('select', 0);
				return false;
			});
		});	
		
		function validate() {
			var selected = $tabs.tabs('option', 'selected'); // => 0		
			
			if(selected == 1)
			{
			return ($("#EmploymentVisaReviewFrm").validate().element("#fnpServiceCode"));
			}
			else return true;
		}
		
		function submitForm(divId){
				$('#EmploymentVisaReviewFrm').append($("#"+divId).html());
				var input = $("<input>").attr("type", "hidden").attr("name", "MainUserApprove").val("MainUserApprove");
				$('#EmploymentVisaReviewFrm').append($(input));
				$.fancybox.showLoading();
				$('#EmploymentVisaReviewFrm').submit();
		}
		
		function cancelForm(divId){
			fancyConfirm('<spring:message code="message.cancel_confirmation_message" />'
					,'<spring:message code="button.No" />'
					,'<spring:message code="button.yes" />'
					, function(ret) {
						if(ret == true){
							//cancel
							var input = $("<input>").attr("type", "hidden").attr("name", "MainUserCancel").val("MainUserCancel");
							$('#EmploymentVisaReviewFrm').append($(input));
							$('#EmploymentVisaReviewFrm').submit();
							$.fancybox.showLoading();
						}
			});
		}
		
		function updateCity() {
		 
	 	$('#strOriginCity >option').remove();
	    $.getJSON("city.json",{contryCode:$("#strNationality").val()},
	    	 function(data) {
	    	
	    	$.each(data,function(key,city){ 		    		
	    		<c:choose>
	    			<c:when
	    				test='${requestScope.requestContextAttribute.locale.language == "ar"}'>
	    					var label = city.labelAr;
	    			</c:when>
	    			<c:otherwise>
	    					var label =  city.labelEn;
	    			</c:otherwise>
	   			</c:choose> 
		    		var id = city.id;
		    		if(id == '${EmploymentVisaReviewerInfo.strOriginCity}'){
		    			$('<option selected=selected/>').val(id).html(label).appendTo('#strOriginCity');
		    		}else{
		    			$('<option/>').val(id).html(label).appendTo('#strOriginCity');
		    		}
	    			
				   
				});
	    	
	    
	    	   });
	     
		  }
		  
		function updateEmirateCity() {
		  	
		  	$('#strCity >option').remove();
	    	$.getJSON("emiratecity.json",{emirateCode:$("#strEmirate").val()},
	    	 function(data) {
	    	
	    	$.each(data,function(key,city){ 		    		
	    		<c:choose>
	    			<c:when
	    				test='${requestScope.requestContextAttribute.locale.language == "ar"}'>
	    					var label = city.labelAr;
	    			</c:when>
	    			<c:otherwise>
	    					var label =  city.labelEn;
	    			</c:otherwise>
	   			</c:choose> 
		    		var id = city.id;
		    		if(id == '${EmploymentVisaReviewerInfo.strCity}'){
		    			$('<option selected=selected/>').val(id).html(label).appendTo('#strCity');
		    		}else{
		    			$('<option/>').val(id).html(label).appendTo('#strCity');
		    		}
				   
				});
	    	
	    
	    	   });
		  
		  }
		
</script>
<!--[if IE 6]>
	<script>
		updateCity = function() {
		    $.getJSON("city.json",{contryCode:$("#strNationality").val()},
		    	 function(data) {
				    	$.each(data,function(key,city){ 		    		
				    		<c:choose>
				    			<c:when
				    				test='${requestScope.requestContextAttribute.locale.language == "ar"}'>
				    					var label = city.labelAr;
				    			</c:when>
				    			<c:otherwise>
				    					var label =  city.labelEn;
				    			</c:otherwise>
				   			</c:choose>
				   			var id = city.id;
				   			
				   			var selectedId = '${EmploymentVisaReviewerInfo.strOriginCity}';
				   			if(id == selectedId || (key == 0 && (selectedId=="" || selectedId==null))){
				    			$("#cuselFrame-strOriginCity .cuselText").html(label);
				    		}	
						});
		    	   });
		    
		}
		updateEmirateCity = function () {
		    $.getJSON("emiratecity.json",{emirateCode:$("#strEmirate").val()},
		    	 function(data) {
				    	$.each(data,function(key,city){ 		    		
				    		<c:choose>
				    			<c:when
				    				test='${requestScope.requestContextAttribute.locale.language == "ar"}'>
				    					var label = city.labelAr;
				    			</c:when>
				    			<c:otherwise>
				    					var label =  city.labelEn;
				    			</c:otherwise>
				   			</c:choose>
				   			var id = city.id;
				   			
				   			var selectedId = '${EmploymentVisaReviewerInfo.strCity}';
				   			if(id == selectedId || (key == 0 && (selectedId=="" || selectedId==null))){	
				    			$("#cuselFrame-strCity .cuselText").html(label);
				    		}
					    		
						});
		    	   });
		  
	   }
	</script>	
<![endif]-->